import {createRouter, createWebHistory, RouteRecordRaw} from "vue-router";
import {ElMessage} from 'element-plus';

export const routes: RouteRecordRaw[] = [
    {
        path: '/',
        redirect: () => {
            let redirectPath = '/test' // 默认重定向路径
            return redirectPath
        }
    },
    {
        path: '/test',
        redirect: '/test/home',
        component: () => import(/* webpackChunkName: "home" */ '@/views/test/home.vue'),
        children: [
            {
                path: 'home',
                component: () => import(/* webpackChunkName: "home" */ '@/views/test/helloWorld.vue'),
                // meta用于提供一些路由用到的配置，例如这是页面名称、页面是否需要鉴权
                meta: {
                    title: '首页',
                    index: 1
                },
            },
            {
                path: 'vuexCeshi',
                component: () => import(/* webpackChunkName: "VUEX" */ '@/views/test/vuexCeshi.vue'),
                meta: {
                    title: 'VUE专题',
                    index: 2
                }
            },
            {
                path: 'ceshi',
                redirect:'ceshi/cs1',
                component: () => import(/* webpackChunkName: "ceshi" */ '../views/test/ceshi/index.vue'),
                meta: {
                    title: '测试',
                    index: 3
                },
                children: [
                    {
                        path: 'cs1',
                        component: () => import(/* webpackChunkName: "cs1" */ '../views/test/ceshi/ceshi_1.vue'),
                        meta: {
                            title: '测试1',
                            index: 10
                        },
                    }]
            },
            {
                path: 'payment',
                component: () => import(/* webpackChunkName: "ceshi" */ '../views/test/payment/index.vue'),
                meta: {
                    title: '支付',
                    index: 4
                }
            },
            {
                path: '3D',
                component: () => import(/* webpackChunkName: "3D" */ '../views/test/three/index.vue'),
                meta: {
                    title: '3D',
                    index: 5
                }
            },
        ]
    },
    {
        path: '/serve',
        redirect: '/serve/home',
        meta: {
            requiresAuth: false,
            title: '服务',
        },
        component: () => import(/* webpackChunkName: "serveLayout" */ '../layout/serveLayout/index.vue'),
        children: [
            {
                path: 'home',
                component: () => import(/* webpackChunkName: "serve/home" */ '../views/serve/home/index.vue'),
                meta: {
                    title: '首页',
                },
            },
        ]
    },
    {
        path: '/login',
        meta: {
            requiresAuth: false,
            title: '登录',
        },
        component: () => import(/* webpackChunkName: "login" */ '../views/login/index.vue'),
        // meta用于提供一些路由用到的配置，例如这是页面名称、页面是否需要鉴权
    },

    {
        path: '/404',
        component: () => import(/* webpackChunkName: "404" */ '../views/404/index.vue'),
    },
    {
        path: '/:catchAll(.*)',
        redirect: '/404',
    }

]
const router = createRouter({
    routes,
    history: createWebHistory()
})

/**
 * 全局前置路由守卫，每一次路由跳转前都进入这个 beforeEach 函数
 */
router.beforeEach((to, from, next) => {
    // 前往的路由是否需要登录
    // （！！！登录所在页的路由需要把requiresAuth设置为false，否则会死循环）
    const requiresAuth = to.meta ? to.meta.requiresAuth : false;
    if (requiresAuth){
        // 登录或者注册才可以往下进行
        if (to.path == '/login') {
            next();
        } else {
            // 获取 token
            const token = localStorage.getItem('token');
            // token 不存在
            if (token === null || token === '') {
                ElMessage.error('您还没有登录，请先登录');
                next('/login');
            } else {
                next();
            }
        }
    } else next()

});
// export default命令用于指定模块的默认输出。显然，一个模块只能有一个默认输出，因此export default命令只能使用一次 https://www.jianshu.com/p/269091e24034
export default router
